<template>
    <div class="messageDetail">
      <div class="weui-form-preview__bd">
        <div class="weui-form-preview__item">
          <label class="weui-form-preview__label">问题发生时间</label>
          <span class="weui-form-preview__value" style="color: rgba(0, 0, 0, 0.9);">{{obj.createTime}}</span>
        </div>
        <div class="weui-form-preview__item">
          <label class="weui-form-preview__label">问题描述</label>
          <span class="weui-form-preview__value"  style="color: rgba(0, 0, 0, 0.9);">{{obj.content}}</span>
        </div>
        <div class="weui-form-preview__item">
          <label class="weui-form-preview__label">问题图片</label>
          <span class="weui-form-preview__value" v-if="obj.contentImg"  style="color: rgba(0, 0, 0, 0.9);">已上传</span>
          <span class="weui-form-preview__value" v-if="!obj.contentImg"  style="color: rgba(0, 0, 0, 0.9);">未上传</span>
        </div>
      </div>
      <div class="weui-form-preview__item" style="border-bottom: 5px solid #ddd;box-sizing: border-box;padding:20rpx;">
        <img :src="obj.contentImg" alt="" class="weuiImg">
      </div >
      <div class="weui-form-preview__item" style="box-sizing: border-box;padding:20rpx;word-spacing:15rpx;">
<!--        <p>{{obj.replyContent}}</p>-->
        <label class="weui-form-preview__label">回复:</label>
        <p style="color: rgba(0, 0, 0, 0.9);">{{obj.replyContent}}</p>
      </div>
      <van-divider contentPosition="center">服务评价</van-divider>
      <div style="display: flex;justify-content: center">
        <van-rate :value="obj.valuationLevel" @change="onChange" style="margin:0 auto" />
      </div>


    </div>

</template>

<script>
    export default {
        name: "index",
        onLoad(options){
            this.id=options.id
        },
        data(){
          return {
              id:"",
              obj:{},
              value:5
          }
        },
      onPullDownRefresh(){
        this.getDetail()
        // wx.stopPullDownRefresh();
        // wx.hideLoading()

      },
        onShow(){
          wx.setNavigationBarTitle({
              title: '回复详情'
          })
            this.getDetail()
        },
        methods:{
            onChange(event) {
            //    console.log(event)
               this.value=event.mp.detail;
                this.$http.request({
                    method: 'POST',
                    url: `/api/callCenter/updateLevel`,
                    body: {
                       id:this.obj.id,
                        valuationLevel:this.value
                    }
                }).then((data)=>{
                    if(data.code==200){
                        wx.showToast({
                            title: '评论成功',
                            icon: 'success',
                            duration: 2000

                        })
                        this.getDetail()
                    }else{
                        wx.showToast({
                            title: '评论失败,请重试',
                            icon: 'none',
                            duration: 2000

                        })
                    }
                })
            },
           getDetail(){
               this.$http.request({
                   method: 'get',
                   url: `/api/callCenter/detail/${this.id}`,
                   body: {

                   }
               }).then((data)=>{
                 wx.stopPullDownRefresh();
                   if(data.code==200){
                       this.obj=data.data;
                       //this.list=data.data;
                   }
               })
           }
        }
    }
</script>

<style scoped>
   .messageDetail{
     width: 100%;
     height: 100%;
     background-color: #fff;
   }
  .weuiImg{
    width: 45%;
  }
</style>
